import { Component, OnInit, ViewChild } from '@angular/core';
import { Router } from '@angular/router';
import { IonInfiniteScroll } from '@ionic/angular';

@Component({
  selector: 'app-scroll',
  templateUrl: './scroll.page.html',
  styleUrls: ['./scroll.page.scss'],
})
export class ScrollPage implements OnInit {
  @ViewChild(IonInfiniteScroll) infiniteScroll: IonInfiniteScroll;

  list = ["Item","Item","Item","Item","Item","Item","Item","Item","Item","Item","Item","Item","Item","Item","Item","Item","Item","Item","Item","Item","Item","Item","Item","Item"]

  constructor(private router: Router) { }

  ngOnInit() {
  }

  gotohome(){
    this.router.navigate(['/tabs/tab2'])
  }

  loadData(event) {
    var newlist = ["Item2","Item2","Item2","Item2","Item2","Item2","Item2","Item2","Item2","Item2"]
    var slist = this.list.concat(newlist)
    this.list = slist
    setTimeout(() => {
      event.target.complete();
      if (this.list.length == 1000) {
        event.target.disabled = true;
      }
    }, 500);
  }

  toggleInfiniteScroll() {
    this.infiniteScroll.disabled = !this.infiniteScroll.disabled;
  }

}
